Skip to content

[pull] main from chakra-ui:main - #299

Merged
pull[bot] merged 4 commits into
code:mainfrom
chakra-ui:main
Aug 20, 2026
Merged

[pull] main from chakra-ui:main#299
pull[bot] merged 4 commits into
code:mainfrom
chakra-ui:main

Conversation

@pull

@pull pull Bot commented Aug 20, 2026

Copy link
Copy Markdown

See Commits and Changes for more details.


Created by pull[bot] (v2.0.0-alpha.4)

Can you help keep this open source service alive? 💖 Please sponsor : )

…3986)

The sidebar starts at scrollTop 0 on load, so any page low in the list sits
below the fold. On the hotkeys page the current link was 2811px down inside a
998px scroller, roughly 1800px out of sight.

Scroll it into view on mount with `nearest`, which does nothing when the item is
already visible, and only on mount, so navigating within the docs does not yank
the sidebar under the pointer. `scrollPaddingBlock` on the aside keeps the link
off the edge instead of flush against it.
…#3985)

* feat(hotkeys): add hotkeys entrypoint for react, solid, vue and svelte

Wrap `@zag-js/hotkeys` in a `hotkeys` entrypoint so keyboard shortcuts can be
registered and inspected from all four frameworks.

- `useHotkey` and `useHotkeys` register commands. `mod+K` resolves per platform
  and `G > H` sequences run through the same hook rather than a separate one.
- `useHotkeyRegistrations` exposes registered commands with their metadata, so a
  command palette renders from the same registration that binds the key.
- `usePressedKeys` and `useIsKeyPressed` track live key state.
- `useHotkeyRecorder` records a chord or sequence for rebinding UIs.
- `usePlatform` and `useFormatHotkey` render shortcuts for the current platform
  without a hydration mismatch.
- `HotkeysProvider` shares one store and sets default options, active scopes,
  conflict behavior and sequence timeout.

Registration reconciles per command against a normalized hotkey, so an unrelated
render or a change to one command leaves the others registered.

Each package uses its own `useSyncExternalStore` from the matching zag package
and its native reactive input type: `MaybeAccessor` in Solid, `MaybeRef` in Vue,
`MaybeFunction` in Svelte.

Three `TODO(zag-bump)` workarounds cover bugs fixed but not yet released in
@zag-js/hotkeys. Verified against a local zag build with all three removed.

* feat(hotkeys): add command palette example to solid, vue and svelte

The palette was React only. Porting it needed the same composition in each
framework: `disableLayer` on `Combobox.Root` so zag's layer stack does not mark
the palette content `pointer-events: none` inside a modal Dialog, and the
combobox content inline rather than in a positioner.

Each palette also sets `lazyMount` and `unmountOnExit` on `Dialog.Root`. Without
them the combobox content renders into the page while the dialog is closed.

* refactor(hotkeys): reset the palette query on exit complete

Clearing the query when the palette opens means every open path has to remember
to do it, and there are already two. Closing is one place, so move the reset to
`onExitComplete` on `Dialog.Root`. It also runs after the exit animation rather
than during it, so the filtered list stays visible while it fades out.

* fix(website): resolve provider examples through the @examples alias

Examples under `providers/` were imported by relative path while everything
under `components/` used `@examples`, because the alias only pointed at the
components directory. Point it at both, so all 619 registry entries import the
same way and the 15 hard-coded `../../../packages/react/src/providers/...` paths
go away.

Provider examples are also gated on a hard-coded list of names, duplicated in
three places. Add the two that were missing, `hotkeys` and `interaction`, so
their examples resolve instead of being looked up under `components/`.

* docs(hotkeys): add hotkeys docs page

Ten live examples and four short guides, marked `status: preview` while the
`TODO(zag-bump)` workarounds are still in place and SSR is unverified.

The palette example moves off `mod+K`. The docs site binds that for its own
search, so on this page it opened both dialogs at once.

* feat(presence): add onEnterComplete and update zag to 1.43.3

`onEnterComplete` is new on the presence machine, so it joins the presence props
and is forwarded through. Vue exposes it as the `enter-complete` emit.

1.43.3 also fixes the emit types the Vue root providers were suppressing, so the
`@ts-expect-error` directives are gone.

* refactor(hotkeys): drop the workarounds for unreleased zag fixes

zag 1.43.3 ships `normalizeHotkey`, `isLinux`, and the `Platform` type, and
fixes both `isPressed` for bare modifiers and listener attachment for commands
registered while disabled.

So the local `normalize-hotkey.ts` copy goes, `useIsKeyPressed` calls
`store.isPressed` directly, and `enabled` no longer forces a re-registration.

* chore: ignore playwright-mcp session artifacts

A snapshot file from a browser session was committed by accident. The directory
is scratch output, so ignore it rather than tracking it.
The page ended in `<ComponentTypes id="hotkeys" />` with no backing type
data, so the section rendered empty. Add the types for all four frameworks,
covering the provider, every hook, and the `UseHotkeysCommand` and
`HotkeyOptions` shapes.

The reactive wrappers differ per framework, so each file carries its own:
plain values in React, `MaybeAccessor`/`Accessor` in Solid, `MaybeRef`/`Ref`
in Vue, and `MaybeFunction`/getters in Svelte.
Every example on the docs page shares one default store, and the store keys
commands by `id`. Three examples registered `id: 'save'` and two registered
`id: 'undo'`, so each registration silently replaced the last one and only
the final example responded to the shortcut.

Pressing `mod+S` ran the command palette's action while the "Multiple
shortcuts" and "Form fields" examples stayed dead; `mod+Z` behaved the same
way. Prefix the ids per example, matching the Toc examples.
@pull pull Bot locked and limited conversation to collaborators Aug 20, 2026
@pull pull Bot added the ⤵️ pull label Aug 20, 2026
@pull
pull Bot merged commit 1a2e8f8 into code:main Aug 20, 2026
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant